import React from 'react'
import Head from 'next/head'
import Link from 'next/link'
import Header from '../components/header'
import Footer from '../components/footer'
import PostList from '../components/post-list'
import CnodeAPi from '../api'
import {navs} from '../store'

export default class Home extends React.Component {
  static async getInitialProps (ctx) {
    // {pathname, query, asPath, req, res, jsonPageRes, err}
    // console.log(ctx.req.method, ctx.req.url, ctx.query)
    // console.log(this.$cnode)
    const query = {
      page: ctx.query.page || 1,
      limit: ctx.query.pageSize || 15,
      tab: ctx.query.tab || ''
    }
    const res = await CnodeAPi.getPostList(query)
    return {
      postList: res.data.data,
      navs,
      query: query
    }
  }
  componentDidMount () {
    window.Home = this
    // this.$cnode.getPostList().then(res => {
    //   console.log(res)
    // })
  }
  render () {
    return (
      <div>
        <Head>
          <title>首页 - Cnode：最专业的 Node.js 开源技术社区</title>
        </Head>
        <Header navs={this.props.navs} />
        <div className="m-container main-container" style={{marginTop: '30px'}}>
          <div className="m-row">
            <div className="m-col-md-8 post-list">
              <PostList postList={this.props.postList} />
            </div>
            <div className="m-col-md-4">
              <div className="m-box"></div>
            </div>
          </div>
        </div>
        <Footer />
      </div>
    )
  }
}
